import React from 'react';
import './App.css';
import SideBar from './components/side-bar/index';
import Monitor from './views/monitor'
import Collect from './views/collect'
import { Routes, Route} from 'react-router-dom'

// interface Camera {
//     id:string
//     type:string
// }

function App() {
    // const cameraList:Array<Camera> = [
    //     {
    //         id:'1',
    //         type:'warn'
    //     },
    //     {
    //         id:'2',
    //         type:'warn'
    //     }
    // ]

    return (
        <div className="app_main">
            <div className='nav_bar'>
                <SideBar />
            </div>
            <div className='main_body'>
                <Routes>
                    <Route path="collect" element={<Collect/>} />
                    <Route path="monitor" element={<Monitor/>} />
                    <Route path="*" element={<Collect/>} />
                </Routes>
            </div>
        </div>
    );
}

export default App;
